<template>
  <el-dialog v-model="showDialog" title="查看岗位" custom-class="partsDialog">
    <div class="content">
      <common-table
        :style="{ flex: 1 }"
        :columns="columns"
        :pagination="pagination"
        :table-data="tableData"
      ></common-table>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="showDialog = false">取消</el-button>
      </span>
    </template>
  </el-dialog>
</template>
<script setup>
import { computed, ref } from 'vue';
import CommonTable from '@/components/CommonTable.vue';
import { columns } from './mockData';
import { getPositionById } from '@/api/depManage';

const emit = defineEmits(['update:viewDepDialog']);
const props = defineProps({
  viewDepDialog: {
    type: Boolean,
    default: false,
  },
  curRow: {
    type: Object,
    default: () => {},
  },
});
// 分页
const pagination = ref({
  pageNum: 1,
  pageSize: 10,
  total: 0,
});

const showDialog = computed({
  get() {
    return props.viewDepDialog;
  },
  set(v) {
    emit('update:viewDepDialog', v);
  },
});

const tableData = ref([]);

const setSize = (val) => {
  pagination.value.pageNum = 1;
  pagination.value.pageSize = val;
  getPageList();
};
const setPage = (val) => {
  pagination.value.pageNum = val;
  getPageList();
};

const getPageList = async () => {
  let par = {
    departmentId: props.curRow.id,
    currentPage: pagination.value.pageNum,
    pageSize: pagination.value.pageSize,
  };
  const res = await getPositionById(par);
  if (res && res.code == 200) {
    tableData.value = res.data.list || [];
    pagination.value.total = res.data.paging.totalPage * 1;
  }
};

getPageList();

defineExpose({
  setSize,
  setPage,
});
</script>

<style lang="less">
.partsDialog {
  display: flex;
  flex-direction: column;
  height: 900px;
  margin-top: 0;
  margin-bottom: 0;

  .el-dialog__body {
    flex: 1;
    padding: 0 24px;
  }

  .content {
    display: flex;
    height: 100%;
  }
}
</style>
